<template>
	<view>
		<!-- <view>疫苗预约</view> -->
		<cu-custom bgColor="bg-E96141" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">疫苗预约</block>
		</cu-custom>
		<scroll-view scroll-y scroll-with-animation :scroll-top="0">
			<view v-for="(item,index) in ymlis" :key="index"  >
				<uni-card style="background-color: #24a7bf;">
					<text style="color: #FFFFFF;" >{{item.title}}</text>
					<view :style="[{backgroundImage:'url('+ item.imgicon +')'}]" class="img" @click="isshow(item.id)"></view>
				</uni-card>
			
				<uni-card :isShadow="true" v-for="(item2,index2) in item.list" :key="index2"   :class="{'flag':item.flag}">
					<view style="display: flex;">
						<view style="flex:1">
							<radio :value="item2.id" :checked="item2.isdefault === 0"  color=#1CBBB4  style="transform:scale(0.7);"@click="changedz(item,item2.id)" />
						</view>
						<view style="display: flex;flex-direction: column; flex:5" >
							<text>名称：{{item2.title}}</text>
							<text>简介：{{item2.des|datafilter}}</text>
							<text>价格：￥{{item2.price}}</text>
							<text style="background-color: red;color: #FFFFFF;border-radius: 15upx;wpidth: 80upx;text-align: center;padding: 15upx; margin-left: 80%;" @click="clickCard(item2.title,item2.des,item2.price,item2.remark,item2.ylbPrice)">预约</text>
						</view>
					</view>
					
				</uni-card>
			</view>
		</scroll-view>

		
	</view>
</template>

<script>
	import uniCard from '../../components/my-componets/uni-card.vue'
	export default {
		comments:{
			uniCard
		},
		data() {
			return {
				ymlis:[{
					'id':'1',
					'name':'卡介疫苗',
					'list':[{'pid':'1','title':'卡介疫苗','des':'新生儿出生后注射的卡介苗均属于免疫规划疫苗，适龄儿童可免费接种','price':0,'isdefault':1},
						 {'pid':'2','title':'水豆疫苗','des':'简介接种水痘疫苗是预防水痘感染行之有效的简便方法。接种水痘疫苗可以刺激机体产生保护性抗体，当病毒入侵时，机体会迅速做出反应，清除病毒，从而达到预防水痘的目的。目前市面上的水痘疫苗均为水痘减毒活疫苗，不良反应少，免疫效果好。费用水痘疫苗属于非免疫规划疫苗，不论儿童还是成人，均需自费、自愿接种。国产减毒活疫苗每剂一般在140元人民币；进口减毒疫苗每剂约300人民币接种对象及剂次推荐>=12月龄的健康儿童及无水痘感染史且未接种过水痘疫苗的成人和青少年接种，包括但不限于','price':'140','isdefault':0}],
					'flag':false,
					'imgicon':'../../static/down.png'
				},
				{
					'id':'2',
					'name':'乙肝疫苗',
					'list':[{'pid':'3','title':'HPV4价疫苗','des':'新生儿出生后注射的卡介苗均属于免疫规划疫苗，适龄儿童可免费接种','price':'2600','isdefault':0},
						 {'pid':'4','title':'HPV9价疫苗','des':'接种水痘疫苗可以刺激机体产生保护性抗体','price':'4900','isdefault':1}],
					'flag':true,
					'imgicon':'../../static/down.png'
				},	{
					'id':'3',
					'name':'百白破疫苗',
					'list':[{'pid':'5','title':'卡介疫苗','des':'新生儿出生后注射的卡介苗均属于免疫规划疫苗，适龄儿童可免费接种','price':0,'isdefault':1},
						 {'pid':'6','title':'水豆疫苗','des':'极少数人接种痘苗后1~2周内会出现暂时性发热，多为轻度发热，无须特殊处理，-般1~2天可自行缓解。适当休息、多喝水、注意保暖有助于缓解。中度发热或时间超过48小时者，可行温水擦浴、冰敷或在医师指导下使用退热药物。','price':'140','isdefault':0}],
					'flag':true,
					'imgicon':'../../static/down.png'
				},
				{
					'id':'4',
					'name':'麻腮风疫苗',
					'list':[{'pid':'7','title':'卡介疫苗','des':'新生儿出生后注射的卡介苗均属于免疫规划疫苗，适龄儿童可免费接种','price':0,'isdefault':0},
						 {'pid':'8', 'title':'水豆疫苗','des':'接种水痘疫苗可以刺激机体产生保护性抗体','price':'140','isdefault':1}],
					'flag':true,
					'imgicon':'../../static/down.png'
				}
				],
				
				
			}
		},
		filters:{
			datafilter(d){
			 if(d.length<12){
					return d
				}else{
					let str=d.slice(0,12)	
					 return str+"..."
				}
							
			},		
		},
		onLoad(){
			this.loadparentMenu()
		},
		methods: {
			// 加载疫苗
			loadparentMenu(){
				let _params ={
					pageNo:1,
					pageSize:50,
					type:4
				}
				console.log("------that.loadparentMenu--")
					let that = this
					let url="/yimiao/yiMiao/list"
					 that.$http.get(url,{params:_params}).then(res=>{
							if(res.data.success){
								//this.ymlis = eval('(' + res.data.result + ')')
								this.ymlis=[]
								let temp =res.data.result
								for (let i=0;i<temp.length;i++) {
									console.log("---------"+temp[i].flag);
									if(i==0){
										temp[i].flag=false
									}
									this.ymlis.push(temp[i])
								}
								console.log(temp)
								console.log("------that.ymlis------"+eval('(' + res.data.result + ')'))
							}
					})	
			},
			isshow(pid){
				this.ymlis.forEach(item=>{
					console.log(pid)
					if(pid==item.id){
						console.log(item.pid)
						item.flag=!item.flag
						
						
					}
					if(item.flag){
						item.imgicon='../../static/down.png'
					}else{
						item.imgicon='../../static/up.png'
					}
				})
				
			},
			changedz(arr,pid){
				let list=arr.list
				console.log(list)
				console.log(pid)
				
				list.forEach(item=>{
					if(item.id==pid){
						if(item.isdefault==0){
							item.isdefault=1
						}else if(item.isdefault==1){
							item.isdefault=0
						}						
					}else{
						item.isdefault=1
					}
				})
			},
			clickCard(e,k,p,remark,ylbprice) {
				// uni.showToast({
				// 	title: e,
				// 	icon: 'none'
				// });
				console.log(8889)
				uni.navigateTo({
					url:'/pages/ymyy/memberinfo?id='+e+'&des='+k+'&price='+p+'&remark='+remark +'&ylbPrice='+ylbprice
				})
			}

		}
	}
</script>

<style>
 .flag{display: none;}
 .img{
	 background-position: center right;
	 background-repeat: no-repeat;
	 background-size: 6%;
	 margin-top: -46upx;
	 height: 30upx;
	 
 }
</style>
